import React, { useState } from 'react'
import { LockOutlined, UserOutlined, CloseCircleOutlined } from '@ant-design/icons';
import { Button, Form, Input, message} from 'antd';
import { useNavigate } from 'react-router-dom'
import './Find_password.scss'
import welcome from '@/images/welcome.png'
var Mock = require("mockjs");
var columnslist = [112, 113, 114, 115];
export default function Find_password() {
  const [form] = Form.useForm()
  const navigate = useNavigate()
  const [loading, setloading] = useState(false)
  const onFinish = (values) => {
    if (values.username1 !== '' || values.password2 !== '' || values.username2 !== '' || values.password1 !== '') {
      setloading(true)
      message.success('修改成功!');
      setTimeout(() => {
        setloading(false)
      }, 1000)
    } else {
      setloading(false)
      message.error('密码或账号错误！')
    }
  };
  const onReset = (values) => {
    navigate('/home')
  }
  return (
    <div className="welcome1">
     车祸预警后台管理系统
      <br />
      <br />
      修改密码
      <br />
      <br />
      <Form
      name="normal_login"
      className="login_form"
      form={form}
      initialValues={{
        remember: true,
      }}
      onFinish={onFinish}>
      <Form.Item
        name="username1"
        rules={[
          {
            required: true,
            message: '请输入用户名!',
          },
        ]}>
        <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="请输入账号" />
      </Form.Item>
      <Form.Item
        name="username2"
        rules={[
          {
            required: true,
            message: '请输入邮箱!',
          },
        ]}>
        <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="请输入邮箱" />
      </Form.Item>
      <Form.Item
        name="password1"
        rules={[
          {
            required: true,
            message: '请输入密码!',
          },
        ]}>
        <Input
          prefix={<LockOutlined className="site-form-item-icon" />}
          type="password"
          placeholder="请输入密码"/>
      </Form.Item>
      <Form.Item
        name="password2"
        rules={[
          {
            required: true,
            message: '请再次输入密码!',
          },
        ]}>
        <Input
          prefix={<LockOutlined className="site-form-item-icon" />}
          type="password"
          placeholder="请再次输入密码"/>
      </Form.Item>
      <Form.Item>
        <div className="loginButton">
          <Button type="primary" htmlType="submit" className="login-form-button" icon={<UserOutlined />} size="large" loading={loading}>确认修改</Button>
        </div>
      </Form.Item>
    </Form>
    </div>
  )
}
